<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,minimum-scale=1.0">
    <title>下载</title>
    <link rel="stylesheet" type="text/css" th:href="@{/fenxiang/css/reset.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/fenxiang/css/Invitation.css}"/>

    <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
    <script th:src="@{/js/flexible.min.js}"></script>
    <script th:src="@{/js/register.js}"></script>
</head>
<body>
<div class="Invitation_top">
    <input th:value="${msg}" type="hidden" id="msg">
    <input th:value="${parentPhoneNow}" type="hidden" id="parentPhone">
    <img th:src="@{/fenxiang/img/Invitation1.png}">
    <p class="Invitation_top_tel">
        <img th:src="@{/fenxiang/img/Invitation2.png}" alt="">推荐人手机号<span th:text="${parentPhone}"></span>
    </p>
</div>
<ul class="Invitation_main">
    <li>
        <span>手机号</span>
        <input type="text" placeholder="请输入手机号" id="phone">
    </li>
    <li>
        <span>验证码</span>
        <input class="yzmInp" type="text" placeholder="请输入验证码" id="code">
        <input class="feachBtn" type="button" value="获取验证码" onclick="time()">
    </li>
    <li>
        <span>设置密码</span>
        <input type="password" placeholder="请设置密码" id="password">
    </li>
    <li>
        <span>确认密码</span>
        <input type="password" placeholder="请再次输入密码" id="passwordNow">
    </li>
</ul>
<p class="Invitation_xieyi">
    <img th:src="@{/fenxiang/img/Invitation5.png}" alt=""><span>已阅读并同意<a onclick="agreement()">《用户协议》</a></span>
</p>
<button class="Invitation_btn"  onclick="save()">立即注册</button>
<button class="Invitation_btn"  onclick="download1()">下载APP</button>
</body>
<script th:src="@{/payment/js/ry-ui.js?v=3.1.0}"></script>
<script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
<script th:inline="javascript"> var ctx = [[@{
    /}]]; var captchaType = [[${captchaType}]]; </script>
<script>
    var prefix = ctx + "app";
    function agreement() {
        window.location.href = prefix + "/share/agreement";
    }
    function download1() {
        window.location.href = prefix + "/share/download";
    }
    function time() {
        var phone = $("#phone").val()
        if (isPhoneNo(phone)) {
            $.ajax({
                url: prefix + "/merchant/getMessageCode?phone=" + phone,
                type: "post",
                processData: false,
                contentType: false,
                dataType: "json",
                success: function (result) {
                    if (result.code == 0) {
                        layer.alert(result.msg)
                    } else {
                        layer.alert(result.msg)
                    }
                }

            })
        } else {
            return
        }

    }

    function isPhoneNo(phone) {
        if (phone.length != 11 || (phone == "" || phone == null)) {
            $.modal.alertError("手机号格式不正确")
        } else {
            var pattern = /^1[3456789]\d{9}$/;
            if(pattern.test(phone)){
                let count = 59;
                const countDown = setInterval(() => {
                    if(count === 0) {
                    $('.feachBtn').val('重新发送').removeAttr('disabled');
                    clearInterval(countDown);
                } else {
                    $('.feachBtn').attr('disabled', true);
                    $('.feachBtn').val(count + '秒');
                }
                count--;
            }, 1000);
                return pattern.test(phone);
            }else {
                $.modal.alertError("手机号格式不正确")
            }
        }
    }
    function save() {
        var formdata = new FormData();
        var phone = $("#phone").val()
        var parentPhone = $("#parentPhone").val()
        var code = $("#code").val()
        var password = $("#password").val()
        var passwordNow = $("#passwordNow").val()

        if (!isPhoneNo(phone)) {
            $.modal.alertError("手机号格式不正确")
            return
        }
        if (code == "" || code == null) {
            $.modal.alertError("请填写验证码")
            return
        }
        if (password == "" || passwordNow == "" || password == null || passwordNow == null) {
            $.modal.alertError("请填写密码")
            return
        }
        if (password != passwordNow) {
            $.modal.alertError("2次密码不一致")
            return
        }

        $.ajax({
            type: "POST",
            url: prefix + "/merchant/register",
            data: {phone: phone, parentPhone: parentPhone, code: code, password: password, passwordNow: passwordNow},
            dataType: "json",
            success: function (ss) {
                if (ss.code == 0) {
                    window.location.href = prefix + "/share/download";
                } else {
                    $.modal.alertError(ss.msg)
                }
            }
        });
    }
</script>
</html>